Introduction

In this reading, you will review the key principles of building navigational tools into the Little Lemon app. You will go through an example and learn how it is done in practice.

Scenario

This reading will specifically assist you in implementing the correct navigation tools when designing the Little Lemon food ordering application in the final project.

Structure

As you may recall, the app must have the following structure:

Header and hero

The first two sections of the page, the header and the hero, display information that is fixed and does not change when the screen changes, like the Little Lemon logo and information about a specific restaurant branch.

Menu breakdown area

The menu breakdown area displays food categories, like Starters, Desserts and Drinks. Once an item from a list is tapped, it will filter the food menu list to display items only from the selected list.

Note : In this project, you will not be required to implement filtering functionality.

Food menu list

The last part is the food menu list. This area shows the list of all foods that were retrieved from the remote server and stored in Core Data. To create this list, you will be creating code that embeds the list of elements in a navigation view.

Each element of this list, when tapped, displays detailed information about the selected food on a new page. In other words, when a food element is tapped, the app navigates to a new view and displays details about the tapped food.

If you have implemented correctly this new page containing details about a food menu item, you will get a link back to the list of food.

The link back is represented by a chevron icon that points to the left on the top left corner of the screen.

This is the navigation you have implemented so far in the app used in this course.

Conclusion

In this reading, you've refreshed your memory on the required structure for the Little Lemon menu app. You should now be able to identify the different navigational areas including the header, hero, menu breakdown, and food menu list.